<template>
<div>
    <div class="panel_whole">
        <div class="panel_dis">
            <div class="panel_move">{{title}}</div>  
            <div>
                <slot name="btn"></slot>
            </div>
        </div>
          
        <el-divider></el-divider>

        <div class="panel_content">
            <slot></slot>
        </div>
    </div>
</div>
</template>

<script>
export default {
  props: {
    title: {
      typr: String,
      default: "默认"
    }
  }
};
</script>

<style lang="less" scoped>
.panel_whole {
  display: flex;
  flex-direction: column;
  height: 880px;
  background: #fff;
  border-radius: 8px;
  border: 1px solid #ccc;
}
.panel_dis {
  display: flex;
  justify-content: space-between;
  height: 50px;
  line-height: 50px;
  padding: 0px 20px;
  .panel_move {
    font-size: 16px;
    color: #333;
  }
}
div/deep/.el-divider--horizontal {
  margin: 0;
}
.panel_content {
  flex: 1;
  overflow-y: scroll;
  padding: 15px;
  width: auto;
}
</style>